import React, { Component } from 'react'
import ListItem from '../../components/ListItem'
import PropTypes from 'prop-types'

export default class index extends Component {
  // 对接受的props进行类型和必要性限制
  static propTypes = {
    updateTodoList: PropTypes.func.isRequired,
    deleteTodoList: PropTypes.func.isRequired,
    todos: PropTypes.array.isRequired,
  }
  render() {
    let {todos, updateTodoList, deleteTodoList} = this.props
    
    return (
      <div>
        <ul className="todo-main">
            {todos.map((item, index) => {
              return <ListItem key={item.id} {...item} updateTodoList={updateTodoList} deleteTodoList={deleteTodoList}/>
            })}
        </ul>
      </div>
    )
  }
}
